<template>
  <body>
    <div class="intro">
      <div class="center">
        <div class="core"></div>
        <div class="outer_one">
          <div class="outer_one__piece"></div>
          <div class="outer_one__piece"></div>
          <div class="outer_one__piece"></div>
          <div class="outer_one__piece"></div>
          <div class="outer_one__piece"></div>
          <div class="outer_one__piece"></div>
          <div class="outer_one__piece"></div>
          <div class="outer_one__piece"></div>
          <div class="outer_one__piece"></div>
          <div class="outer_one__piece"></div>
          <div class="outer_one__piece"></div>
          <div class="outer_one__piece"></div>
          <div class="outer_one__piece"></div>
          <div class="outer_one__piece"></div>
          <div class="outer_one__piece"></div>
          <div class="outer_one__piece"></div>
          <div class="outer_one__piece"></div>
          <div class="outer_one__piece"></div>
          <div class="outer_one__piece"></div>
          <div class="outer_one__piece"></div>
          <div class="outer_one__piece"></div>
          <div class="outer_one__piece"></div>
          <div class="outer_one__piece"></div>
          <div class="outer_one__piece"></div>
          <div class="outer_one__piece"></div>
          <div class="outer_one__piece"></div>
          <div class="outer_one__piece"></div>
          <div class="outer_one__piece"></div>
          <div class="outer_one__piece"></div>
          <div class="outer_one__piece"></div>
          <div class="outer_one__piece"></div>
          <div class="outer_one__piece"></div>
          <div class="outer_one__piece"></div>
          <div class="outer_one__piece"></div>
          <div class="outer_one__piece"></div>
          <div class="outer_one__piece"></div>
        </div>
        <div class="outer_two">
          <div class="outer_two__piece"></div>
          <div class="outer_two__piece"></div>
          <div class="outer_two__piece"></div>
          <div class="outer_two__piece"></div>
          <div class="outer_two__piece"></div>
          <div class="outer_two__piece"></div>
          <div class="outer_two__piece"></div>
          <div class="outer_two__piece"></div>
          <div class="outer_two__piece"></div>
          <div class="outer_two__piece"></div>
          <div class="outer_two__piece"></div>
          <div class="outer_two__piece"></div>
          <div class="outer_two__piece"></div>
          <div class="outer_two__piece"></div>
          <div class="outer_two__piece"></div>
          <div class="outer_two__piece"></div>
          <div class="outer_two__piece"></div>
          <div class="outer_two__piece"></div>
          <div class="outer_two__piece"></div>
          <div class="outer_two__piece"></div>
          <div class="outer_two__piece"></div>
          <div class="outer_two__piece"></div>
          <div class="outer_two__piece"></div>
          <div class="outer_two__piece"></div>
          <div class="outer_two__piece"></div>
          <div class="outer_two__piece"></div>
          <div class="outer_two__piece"></div>
          <div class="outer_two__piece"></div>
          <div class="outer_two__piece"></div>
          <div class="outer_two__piece"></div>
          <div class="outer_two__piece"></div>
          <div class="outer_two__piece"></div>
          <div class="outer_two__piece"></div>
          <div class="outer_two__piece"></div>
          <div class="outer_two__piece"></div>
          <div class="outer_two__piece"></div>
        </div>
        <div class="outer_three">
          <div class="outer_three__piece"></div>
          <div class="outer_three__piece"></div>
          <div class="outer_three__piece"></div>
          <div class="outer_three__piece"></div>
          <div class="outer_three__piece"></div>
          <div class="outer_three__piece"></div>
          <div class="outer_three__piece"></div>
          <div class="outer_three__piece"></div>
          <div class="outer_three__piece"></div>
          <div class="outer_three__piece"></div>
          <div class="outer_three__piece"></div>
          <div class="outer_three__piece"></div>
          <div class="outer_three__piece"></div>
          <div class="outer_three__piece"></div>
          <div class="outer_three__piece"></div>
          <div class="outer_three__piece"></div>
          <div class="outer_three__piece"></div>
          <div class="outer_three__piece"></div>
          <div class="outer_three__piece"></div>
          <div class="outer_three__piece"></div>
          <div class="outer_three__piece"></div>
          <div class="outer_three__piece"></div>
          <div class="outer_three__piece"></div>
          <div class="outer_three__piece"></div>
          <div class="outer_three__piece"></div>
          <div class="outer_three__piece"></div>
          <div class="outer_three__piece"></div>
          <div class="outer_three__piece"></div>
          <div class="outer_three__piece"></div>
          <div class="outer_three__piece"></div>
          <div class="outer_three__piece"></div>
          <div class="outer_three__piece"></div>
          <div class="outer_three__piece"></div>
          <div class="outer_three__piece"></div>
          <div class="outer_three__piece"></div>
          <div class="outer_three__piece"></div>
        </div>
        <div class="outer_four">
          <div class="outer_four__piece"></div>
          <div class="outer_four__piece"></div>
          <div class="outer_four__piece"></div>
          <div class="outer_four__piece"></div>
          <div class="outer_four__piece"></div>
          <div class="outer_four__piece"></div>
          <div class="outer_four__piece"></div>
          <div class="outer_four__piece"></div>
          <div class="outer_four__piece"></div>
          <div class="outer_four__piece"></div>
          <div class="outer_four__piece"></div>
          <div class="outer_four__piece"></div>
          <div class="outer_four__piece"></div>
          <div class="outer_four__piece"></div>
          <div class="outer_four__piece"></div>
          <div class="outer_four__piece"></div>
          <div class="outer_four__piece"></div>
          <div class="outer_four__piece"></div>
          <div class="outer_four__piece"></div>
          <div class="outer_four__piece"></div>
          <div class="outer_four__piece"></div>
          <div class="outer_four__piece"></div>
          <div class="outer_four__piece"></div>
          <div class="outer_four__piece"></div>
          <div class="outer_four__piece"></div>
          <div class="outer_four__piece"></div>
          <div class="outer_four__piece"></div>
          <div class="outer_four__piece"></div>
          <div class="outer_four__piece"></div>
          <div class="outer_four__piece"></div>
          <div class="outer_four__piece"></div>
          <div class="outer_four__piece"></div>
          <div class="outer_four__piece"></div>
          <div class="outer_four__piece"></div>
          <div class="outer_four__piece"></div>
          <div class="outer_four__piece"></div>
        </div>
        <div class="outer_five">
          <div class="outer_five__piece"></div>
          <div class="outer_five__piece"></div>
          <div class="outer_five__piece"></div>
          <div class="outer_five__piece"></div>
          <div class="outer_five__piece"></div>
          <div class="outer_five__piece"></div>
          <div class="outer_five__piece"></div>
          <div class="outer_five__piece"></div>
          <div class="outer_five__piece"></div>
          <div class="outer_five__piece"></div>
          <div class="outer_five__piece"></div>
          <div class="outer_five__piece"></div>
          <div class="outer_five__piece"></div>
          <div class="outer_five__piece"></div>
          <div class="outer_five__piece"></div>
          <div class="outer_five__piece"></div>
          <div class="outer_five__piece"></div>
          <div class="outer_five__piece"></div>
          <div class="outer_five__piece"></div>
          <div class="outer_five__piece"></div>
          <div class="outer_five__piece"></div>
          <div class="outer_five__piece"></div>
          <div class="outer_five__piece"></div>
          <div class="outer_five__piece"></div>
          <div class="outer_five__piece"></div>
          <div class="outer_five__piece"></div>
          <div class="outer_five__piece"></div>
          <div class="outer_five__piece"></div>
          <div class="outer_five__piece"></div>
          <div class="outer_five__piece"></div>
          <div class="outer_five__piece"></div>
          <div class="outer_five__piece"></div>
          <div class="outer_five__piece"></div>
          <div class="outer_five__piece"></div>
          <div class="outer_five__piece"></div>
          <div class="outer_five__piece"></div>
        </div>
        <div class="pieces">
          <div class="future_ui__piece" @click="changeMenu('/daily')">
            <span>日常</span>
            <div class="line"></div>
            <div class="tip">笔记</div>
          </div>
          <div class="future_ui__piece" @click="changeMenu('/other')">
            <span>Teleport</span>
            <div class="line"></div>
            <div class="tip">Beam me up!</div>
          </div>
          <div class="future_ui__piece" @click="changeMenu('/login')">
            <span>登录</span>
            <div class="line"></div>
            <div class="tip">about login!</div>
          </div>
          <div class="future_ui__piece">
            <span>Laser target</span>
            <div class="line"></div>
            <div class="tip">Charge laz0rs!</div>
          </div>
          <div class="future_ui__piece">
            <span>Shields</span>
            <div class="line"></div>
            <div class="tip">Status report!</div>
          </div>
          <div class="future_ui__piece blank"></div>
          <div class="future_ui__piece blank"></div>
          <div class="future_ui__piece blank"></div>
          <div class="future_ui__piece blank"></div>
          <div class="future_ui__piece blank"></div>
          <div class="future_ui__piece blank"></div>
          <div class="future_ui__piece blank"></div>
          <div class="future_ui__piece blank"></div>
          <div class="future_ui__piece blank"></div>
          <div class="future_ui__piece blank"></div>
          <div class="future_ui__piece blank"></div>
          <div class="future_ui__piece blank"></div>
          <div class="future_ui__piece blank"></div>
          <div class="future_ui__piece blank"></div>
          <div class="future_ui__piece blank"></div>
          <div class="future_ui__piece blank"></div>
          <div class="future_ui__piece blank"></div>
          <div class="future_ui__piece blank"></div>
          <div class="future_ui__piece blank"></div>
          <div class="future_ui__piece blank"></div>
          <div class="future_ui__piece blank"></div>
          <div class="future_ui__piece blank"></div>
          <div class="future_ui__piece blank"></div>
          <div class="future_ui__piece blank"></div>
          <div class="future_ui__piece blank"></div>
          <div class="future_ui__piece blank"></div>
          <div class="future_ui__piece blank"></div>
          <div class="future_ui__piece blank"></div>
          <div class="future_ui__piece blank"></div>
          <div class="future_ui__piece blank"></div>
          <div class="future_ui__piece blank"></div>
        </div>
      </div>
    </div>
  </body>
</template>

<script>
export default {
  name: "ClockMenu",
  methods: {
    changeMenu(v) {
      this.$router.push(v);
    },
  },
};
</script>

<style lang="scss" scoped>
@import "./bg.scss";
</style>